草庐IT

vue 组件的引用

全部标签

javascript - 使用 Vuex 的 Vue.js 中的计算属性上的观察者未更新数据变量

fiddle:https://jsfiddle.net/mjvu6bn7/我有一个计算属性的观察者,它依赖于异步设置的Vuex存储变量。当这个计算属性发生变化时,我试图设置Vue组件的数据变量,但这并没有发生。这是Vue组件:newVue({el:'#app',store,data:{myVar:""},beforeMount(){this.$store.dispatch('FETCH_PETS',{}).then(()=>{console.log("fetchedpets")})},computed:{pets(){returnthis.$store.state.pets}},wat

javascript - 'this' 绑定(bind)到订阅函数而不是 Angular2 中的外部组件范围

我在Angular2中的一个组件中遇到问题,因为“this”在我的一个组件中绑定(bind)到错误的上下文。我有其他组件没有发生此问题,但我看不出有什么区别。这是我的代码:组件:import{Component,Input}from'@angular/core';import{FilesService}from"./services/files.service";@Component({selector:'my-app',moduleId:module.id,templateUrl:'/app/views/app.html'})exportclassAppComponent{openF

javascript - 通过 React.cloneElement 维护组件引用

我一直在测试使用React.cloneElement()扩展组件的children可能存在的限制/危险。我发现的一种可能的危险是可能会覆盖ref和key等Prop。但是,根据React的0.13releasecandidate(早在2015年):However,unlikeJSXandcloneWithProps,italsopreservesrefs.Thismeansthatifyougetachildwitharefonit,youwon'taccidentallystealitfromyourancestor.Youwillgetthesamerefattachedtoyour

javascript - React - 从另一个组件的 onClick 切换一个组件的显示

我正在尝试构建我的第一个React项目,目前正在将一个汉堡导航按钮和一个在单击导航时出现的菜单放在一起。我将其分为两个部分;汉堡和MenuOverlay。两者的代码如下。目前,我在Hamburger上有一个onClick可以在其上切换一个类,但是我如何通过该点击来切换菜单?它隐藏在display:none;默认情况下。可能是一个非常基本的问题,所以很抱歉-仍在努力让我了解React。菜单覆盖importReactfrom'react';import{Link}from'react-router';constMenuOverlay=()=>{return(HomeAboutContact

javascript - 使用渲染功能时 Vue 组件不显示子文本节点

我正在尝试用Vue2做一个可编辑的组件。它应该在任何标签中使用contenteditable属性,替换普通输入。我想给它一个占位符功能,以便在用户没有提供任何值时显示一个值,但我似乎无法让它工作。我正在观察组件的当前值,并在不存在用户内容时将data.isEmpty设置为true。该组件随后应显示占位符值,但目前它什么都不显示。如果我console.logrender方法的结果,它将显示占位符子节点已正确实例化,但由于某些原因它不会显示在最终的HTML上。这是一个JSFiddle:https://jsfiddle.net/dy27fa8t/对于那些喜欢它的人来说,还有一个嵌入的片段:V

javascript - 尝试在 vue.js 中创建就地编辑样式表单

这是我第一次尝试使用vue创建任何东西。Here'saquickJSFiddledemo我正在尝试创建一个无需输入即可显示值的表单,然后单击,将显示输入。我已经设法让模型“工作”了,但我不太确定这是否是正确的方法。我不太确定:Vue.nextTick(function(){document.getElementById(field.id).focus();});另一方面,有没有推荐的输入验证库之类的?我真的很感激这里的任何指导方针:wink:谢谢! 最佳答案 关于您的第一个问题,我认为使用纯JavaScript专注于您的输入没有问题

javascript - 将 Vue.js 与 Typescript 一起使用时如何使用 vue-resource 等插件?

我开始使用Typescript并尝试将其应用到我的项目中。但是,我无法使用vue-resource等Vue.js插件。当我使用this.$http.post()我得到错误:errorTS2339:Property'$http'doesnotexistontype'typeofVue'.这是有道理的,因为我在类里面。但是我该怎么做呢?这是我的完整组件:SignupNamePleaseprovideaname.PasswordPleaseprovideapassword.importComponentfrom'vue-class-component'@Componentexportdefa

javascript - 替换数组元素而不丢失引用?

如何在不丢失引用的情况下替换数组的所有元素?vararr=[1,2,3];varb=arr;b==arr;//truemagic(arr,[4,5,6]);b==arr;//shouldreturntrue一种方法是弹出和推送。有干净的方法吗? 最佳答案 您可以拼接旧值并附加新值。functionmagic(reference,array){[].splice.apply(reference,[0,reference.length].concat(array));}vararr=[1,2,3],b=arr;console.log(b

javascript - 使用 Redux、React 和 react-router-dom 4.x 时从动态组件获取 ref

我有以下类(class)classMatchBoxextendsReact.Component{constructor(props){super(props);this.countdownHandler=null;this.showBlocker=true;this.start=this.start.bind(this);}start(){...}render(){...return(...);}};functionmapStateToProps(state){...}functionmatchDispatchToProps(dispatch){...}exportdefaultwit

javascript - [Vue 警告] : Failed to resolve directive: bin

我是VueJS的新手。您好,尽管我的应用程序正在运行,但我在控制台中收到此错误,该错误阻止了jQuery。v-for="messageinmessages"遍历对象并尝试显示对象。但收到此错误Vuewarn]:Failedtoresolvedirective:bin@{{message.fileName}}@{{message.sentAt}}@{{message.content}}@{{message.sentAt}}实际上这是一个laravelblade所以不用担心@符号 最佳答案 我在添加v-bind指令后遇到了同样的错误。结